<template>
  <div>
    <HomeHeader></HomeHeader>
    <HomeSlide :swiperList="swiperList"></HomeSlide>
    <HomeIcon :iconList="iconList"></HomeIcon>
    <HomeRecommend :recommendList="recommendList"></HomeRecommend>
    <HomeWeekend :weekendList="weekendList"></HomeWeekend>
  </div>
</template>
  
<script>
import HomeHeader from '@/components/Home/HomeHeader.vue';
import HomeSlide from '@/components/Home/HomeSlide.vue'
import HomeIcon from '@/components/Home/HomeIcon.vue';
import HomeRecommend from '@/components/Home/HomeRecommend.vue';
import HomeWeekend from '@/components/Home/HomeWeekend.vue';

import axios from 'axios'

export default {
  name: 'Home',
  data() {
    return{
      iconList:[],
      recommendList:[],
      swiperList:[],
      weekendList:[],
    }
  },
  components: {
    HomeHeader,
    HomeSlide,
    HomeIcon,
    HomeRecommend,
    HomeWeekend
  },
  mounted() {
    this.getHomeInfo();
  },
  methods: {
    getHomeInfo() {
      axios.get('/data/index.json').then(res => {
        // console.log(res);
        this.iconList = res.data.data.iconList;
        this.recommendList = res.data.data.recommendList;
        this.swiperList = res.data.data.swiperList;
        this.weekendList = res.data.data.weekendList;
      })
    }
  }
}
</script>
  
<style lang="scss" scoped>

</style>